<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>首页</title>
    <script src="../../resources/app/all.js" type="text/javascript"></script>
    <script src="http://lib.baomitu.com/echarts/4.7.0/echarts.js"></script>

</head>
<body>
<div class="layui-fluid">
    <div class="layui-row">
        <div class="layui-col-lg4">
            <div class="layui-row">
                <div class="layui-col-lg12">
                    <div id="left_top" style="height: 400px"></div>
                </div>
            </div>
            <div class="layui-row">
                <div class="layui-col-lg12">
                    <div id="left_center" style="height: 400px"></div>
                </div>
            </div>
            <div class="layui-row">
                <div class="layui-col-lg12">
                    <div id="left_foot" style="height: 300px"></div>
                </div>
            </div>
        </div>
        <div class="layui-col-lg8">
            <div class="layui-row">
                <div class="layui-col-lg12">
                    <div id="right_center" style="height: 700px"></div>
                </div>
            </div>
            <div class="layui-row">
                <div class="layui-col-lg12">
                    <div id="right_foot" style="height: 400px"></div>
                </div>
            </div>
        </div>
    </div>
</div>

<script src="../../resources/js/map/china.js"></script>

<script type="text/javascript">
    //left
    let leftTopChart = echarts.init(document.getElementById('left_top'));
    let leftCenterChart = echarts.init(document.getElementById('left_center'));
    let leftFootChart = echarts.init(document.getElementById('left_foot'));
    leftTop(leftTopChart);
    leftCenter(leftCenterChart);
    leftFoot(leftFootChart);
    //right
    let rightCenterChart = echarts.init(document.getElementById('right_center'));
    let rightFootChart = echarts.init(document.getElementById('right_foot'));
    rightCenter(rightCenterChart);
    rightFoot(rightFootChart);

    function leftTop(myChart) {
        const xAxisData = ["2020-05-11", "2020-05-12", "2020-05-13", "2020-05-14", "2020-05-15", "2020-05-16", "2020-05-17", "2020-05-18", "2020-05-19", "2020-05-20", "2020-05-21", "2020-05-22", "2020-05-23", "2020-05-24", "2020-05-25", "2020-05-26", "2020-05-27", "2020-05-28", "2020-05-29", "2020-05-30", "2020-05-31", "2020-06-01", "2020-06-02", "2020-06-03", "2020-06-04", "2020-06-05", "2020-06-06", "2020-06-07", "2020-06-08", "2020-06-09", "2020-06-10"]
        let option = {
            "textStyle": {
                "fontFamily": "Din-Light"
            },
            "color": ["#123dac", "#73e2e2", "#ff7e85", "#9b52ff", "#fac524", "#46caff", "#a1e867", "#10b2b2", "#ec87f7", "#f4905a", "#00baba", "#facf24", "#e89d67", "#23c6c6", "#fa8699", "#40b7fc", "#006d75", "#595959", "#f4764f", "#a640fc", "#fda23f", "#2d7ae4", "#5092ff", "#9351ed", "#8a89fe", "#df89e8", "#2797ff", "#6ad089", "#7c92e8 "],
            "title": {
                "text": "",
                "left": "47%",
                "textStyle": {
                    "fontSize": 24
                }
            },
            "legend": {
                "data": [{
                    "name": "白起",
                    "icon": "path://M512 139.81262864a286.42534744 286.42534744 0 1 0 286.42534744 286.42534744 286.42534744 286.42534744 0 0 0-286.42534744-286.42534744z m0 477.3755789a190.95023144 190.95023144 0 1 1 190.95023144-190.95023146 190.95023144 190.95023144 0 0 1-190.95023144 190.95023146z"
                }, {
                    "name": "李泽言",
                    "icon": "path://M512 139.81262864a286.42534744 286.42534744 0 1 0 286.42534744 286.42534744 286.42534744 286.42534744 0 0 0-286.42534744-286.42534744z m0 477.3755789a190.95023144 190.95023144 0 1 1 190.95023144-190.95023146 190.95023144 190.95023144 0 0 1-190.95023144 190.95023146z"
                }, {
                    "name": "许墨",
                    "icon": "path://M512 139.81262864a286.42534744 286.42534744 0 1 0 286.42534744 286.42534744 286.42534744 286.42534744 0 0 0-286.42534744-286.42534744z m0 477.3755789a190.95023144 190.95023144 0 1 1 190.95023144-190.95023146 190.95023144 190.95023144 0 0 1-190.95023144 190.95023146z"
                }],
                "left": "left",
                "selected": {
                    "白起": true,
                    "李泽言": true,
                    "许墨": true
                },
                "itemWidth": 10,
                "itemHeight": 10,
                "itemGap": 10,
                "textStyle": {
                    "color": "#898989",
                    "lineHeight": 15
                },
                "type": "scroll",
            },
            "tooltip": {
                "backgroundColor": "#fff",
                "trigger": "axis",
                "axisPointer": {
                    "type": "none"
                },
                "textStyle": {
                    "color": "#565656",
                    "lineHeight": 28
                },
                "confine": true,
                "padding": 12,
                "extraCssText": "box-shadow: 0px 2px 8px 0px #cacaca;border-radius: 4px;opacity: 0.9;max-height: 100%;",
                "formatter": {
                    "_custom": {
                        "type": "function",
                        "display": "<span>ƒ</span> (params)"
                    }
                }
            },
            "grid": {
                "left": 0,
                "right": 0,
                "top": 100,
                "bottom": 100
            },
            "xAxis": {
                "type": "category",
                "boundaryGap": true,
                "data": xAxisData,
                "axisLabel": {
                    "color": "#a0a9bc",
                    //X轴标签 label 做了特殊处理，防止左右溢出
                    formatter: (value, index) => {
                        if (index === 0 || index === xAxisData.length - 1) {
                            return "";
                        }
                        return value;
                    }
                },
                "axisLine": {
                    "show": false
                },
                "axisTick": {
                    "show": false
                }
            },
            "yAxis": {
                "name": "",
                "nameTextStyle": {
                    "color": "gray"
                },
                "type": "value",
                "axisLabel": {
                    "color": "#a0a9bc",
                    "inside": true,
                    "margin": 0,
                    "verticalAlign": "bottom"
                },
                "splitLine": {
                    "lineStyle": {
                        "type": "dashed"
                    }
                },
                "minInterval": 1,
                "axisLine": {
                    "show": false
                },
                "axisTick": {
                    "show": false
                }
            },
            "series": [{
                "name": "白起",
                "data": [43, 58, 195, 229, 320, 211, 124, 131, 124, 360, 124, 78, 160, 604, 17, 0, 0, 0, 2, 8, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
                "type": "line",
                "smooth": true,
                "smoothMonotone": "x",
                "cursor": "pointer",
                "showSymbol": false,
                "lineStyle": {
                    "shadowColor": "rgba(18,61,172,0.5)",
                    "shadowBlur": 10
                }
            }, {
                "name": "李泽言",
                "data": [23, 39, 118, 71, 116, 89, 58, 71, 51, 146, 31, 41, 61, 485, 5, 0, 0, 0, 0, 3, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
                "type": "line",
                "smooth": true,
                "smoothMonotone": "x",
                "cursor": "pointer",
                "showSymbol": false,
                "lineStyle": {
                    "shadowColor": "rgba(115,226,226,0.5)",
                    "shadowBlur": 10
                }
            }, {
                "name": "许墨",
                "data": [20, 37, 91, 72, 68, 67, 54, 42, 42, 115, 41, 33, 64, 312, 4, 0, 0, 0, 3, 4, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0, 0],
                "type": "line",
                "smooth": true,
                "smoothMonotone": "x",
                "cursor": "pointer",
                "showSymbol": false,
                "lineStyle": {
                    "shadowColor": "rgba(255,126,133,0.5)",
                    "shadowBlur": 10
                }
            }]
        }
        myChart.setOption(option);
    }

    function leftCenter(myChart) {
        let option = {
            tooltip : {
                trigger: 'axis',
                axisPointer : {            // 坐标轴指示器，坐标轴触发有效
                    type : 'shadow'        // 默认为直线，可选为：'line' | 'shadow'
                }
            },
            legend: {
                data:['直接访问','邮件营销','联盟广告','视频广告','搜索引擎','百度','谷歌','必应','其他']
            },
            toolbox: {
                show : true,
                orient: 'vertical',
                x: 'right',
                y: 'center',
                feature : {
                    mark : {show: true},
                    dataView : {show: true, readOnly: false},
                    magicType : {show: true, type: ['line', 'bar', 'stack', 'tiled']},
                    restore : {show: true},
                    saveAsImage : {show: true}
                }
            },
            calculable : true,
            xAxis : [
                {
                    type : 'category',
                    data : ['周一','周二','周三','周四','周五','周六','周日']
                }
            ],
            yAxis : [
                {
                    type : 'value'
                }
            ],
            series : [
                {
                    name:'直接访问',
                    type:'bar',
                    data:[320, 332, 301, 334, 390, 330, 320]
                },
                {
                    name:'邮件营销',
                    type:'bar',
                    stack: '广告',
                    data:[120, 132, 101, 134, 90, 230, 210]
                },
                {
                    name:'联盟广告',
                    type:'bar',
                    stack: '广告',
                    data:[220, 182, 191, 234, 290, 330, 310]
                },
                {
                    name:'视频广告',
                    type:'bar',
                    stack: '广告',
                    data:[150, 232, 201, 154, 190, 330, 410]
                },
                {
                    name:'搜索引擎',
                    type:'bar',
                    data:[862, 1018, 964, 1026, 1679, 1600, 1570],
                    markLine : {
                        itemStyle:{
                            normal:{
                                lineStyle:{
                                    type: 'dashed'
                                }
                            }
                        },
                        data : [
                            [{type : 'min'}, {type : 'max'}]
                        ]
                    }
                },
                {
                    name:'百度',
                    type:'bar',
                    barWidth : 5,
                    stack: '搜索引擎',
                    data:[620, 732, 701, 734, 1090, 1130, 1120]
                },
                {
                    name:'谷歌',
                    type:'bar',
                    stack: '搜索引擎',
                    data:[120, 132, 101, 134, 290, 230, 220]
                },
                {
                    name:'必应',
                    type:'bar',
                    stack: '搜索引擎',
                    data:[60, 72, 71, 74, 190, 130, 110]
                },
                {
                    name:'其他',
                    type:'bar',
                    stack: '搜索引擎',
                    data:[62, 82, 91, 84, 109, 110, 120]
                }
            ]
        };
        myChart.setOption(option);
    }

    function leftFoot(myChart) {
        let option = {
                title : {
                    text: '预算 vs 开销（Budget vs spending）',
                    subtext: '纯属虚构'
                },
                tooltip : {
                    trigger: 'axis'
                },
                legend: {
                    orient : 'vertical',
                    x : 'right',
                    y : 'bottom',
                    data:['预算分配（Allocated Budget）','实际开销（Actual Spending）']
                },
                toolbox: {
                    show : true,
                    feature : {
                        mark : {show: true},
                        dataView : {show: true, readOnly: false},
                        restore : {show: true},
                        saveAsImage : {show: true}
                    }
                },
                polar : [
                    {
                        indicator : [
                            { text: '销售（sales）', max: 6000},
                            { text: '管理（Administration）', max: 16000},
                            { text: '信息技术（Information Techology）', max: 30000},
                            { text: '客服（Customer Support）', max: 38000},
                            { text: '研发（Development）', max: 52000},
                            { text: '市场（Marketing）', max: 25000}
                        ]
                    }
                ],
                calculable : true,
                series : [
                    {
                        name: '预算 vs 开销（Budget vs spending）',
                        type: 'radar',
                        data : [
                            {
                                value : [4300, 10000, 28000, 35000, 50000, 19000],
                                name : '预算分配（Allocated Budget）'
                            },
                            {
                                value : [5000, 14000, 28000, 31000, 42000, 21000],
                                name : '实际开销（Actual Spending）'
                            }
                        ]
                    }
                ]
            };
        myChart.setOption(option);
    }


    function rightCenter(myChart) {
        let name_title = "中国人民大学2017年各省市计划录取人数"
        let subname = '数据爬取自千栀网\n，\n上海、浙江无文理科录取人数'
        let nameColor = " rgb(55, 75, 113)"
        let name_fontFamily = '等线'
        let subname_fontSize = 15
        let name_fontSize = 18
        let mapName = 'china'
        let data = [
            {name:"北京",value:177},
            {name:"天津",value:42},
            {name:"河北",value:102},
            {name:"山西",value:81},
            {name:"内蒙古",value:47},
            {name:"辽宁",value:67},
            {name:"吉林",value:82},
            {name:"黑龙江",value:66},
            {name:"上海",value:24},
            {name:"江苏",value:92},
            {name:"浙江",value:114},
            {name:"安徽",value:109},
            {name:"福建",value:116},
            {name:"江西",value:91},
            {name:"山东",value:119},
            {name:"河南",value:137},
            {name:"湖北",value:116},
            {name:"湖南",value:114},
            {name:"重庆",value:91},
            {name:"四川",value:125},
            {name:"贵州",value:62},
            {name:"云南",value:83},
            {name:"西藏",value:9},
            {name:"陕西",value:80},
            {name:"甘肃",value:56},
            {name:"青海",value:10},
            {name:"宁夏",value:18},
            {name:"新疆",value:67},
            {name:"广东",value:123},
            {name:"广西",value:59},
            {name:"海南",value:14},
        ];

        let geoCoordMap = {};
        let toolTipData = [
            {name:"北京",value:[{name:"文科",value:95},{name:"理科",value:82}]},
            {name:"天津",value:[{name:"文科",value:22},{name:"理科",value:20}]},
            {name:"河北",value:[{name:"文科",value:60},{name:"理科",value:42}]},
            {name:"山西",value:[{name:"文科",value:40},{name:"理科",value:41}]},
            {name:"内蒙古",value:[{name:"文科",value:23},{name:"理科",value:24}]},
            {name:"辽宁",value:[{name:"文科",value:39},{name:"理科",value:28}]},
            {name:"吉林",value:[{name:"文科",value:41},{name:"理科",value:41}]},
            {name:"黑龙江",value:[{name:"文科",value:35},{name:"理科",value:31}]},
            {name:"上海",value:[{name:"文科",value:12},{name:"理科",value:12}]},
            {name:"江苏",value:[{name:"文科",value:47},{name:"理科",value:45}]},
            {name:"浙江",value:[{name:"文科",value:57},{name:"理科",value:57}]},
            {name:"安徽",value:[{name:"文科",value:57},{name:"理科",value:52}]},
            {name:"福建",value:[{name:"文科",value:59},{name:"理科",value:57}]},
            {name:"江西",value:[{name:"文科",value:49},{name:"理科",value:42}]},
            {name:"山东",value:[{name:"文科",value:67},{name:"理科",value:52}]},
            {name:"河南",value:[{name:"文科",value:69},{name:"理科",value:68}]},
            {name:"湖北",value:[{name:"文科",value:60},{name:"理科",value:56}]},
            {name:"湖南",value:[{name:"文科",value:62},{name:"理科",value:52}]},
            {name:"重庆",value:[{name:"文科",value:47},{name:"理科",value:44}]},
            {name:"四川",value:[{name:"文科",value:65},{name:"理科",value:60}]},
            {name:"贵州",value:[{name:"文科",value:32},{name:"理科",value:30}]},
            {name:"云南",value:[{name:"文科",value:42},{name:"理科",value:41}]},
            {name:"西藏",value:[{name:"文科",value:5},{name:"理科",value:4}]},
            {name:"陕西",value:[{name:"文科",value:38},{name:"理科",value:42}]},
            {name:"甘肃",value:[{name:"文科",value:28},{name:"理科",value:28}]},
            {name:"青海",value:[{name:"文科",value:5},{name:"理科",value:5}]},
            {name:"宁夏",value:[{name:"文科",value:10},{name:"理科",value:8}]},
            {name:"新疆",value:[{name:"文科",value:36},{name:"理科",value:31}]},
            {name:"广东",value:[{name:"文科",value:63},{name:"理科",value:60}]},
            {name:"广西",value:[{name:"文科",value:29},{name:"理科",value:30}]},
            {name:"海南",value:[{name:"文科",value:8},{name:"理科",value:6}]},
        ];

        /*获取地图数据*/
        myChart.showLoading();
        let mapFeatures = echarts.getMap(mapName).geoJson.features;
        myChart.hideLoading();
        mapFeatures.forEach(function(v) {
            // 地区名称
            var name = v.properties.name;
            // 地区经纬度
            geoCoordMap[name] = v.properties.cp;

        });

// console.log("============geoCoordMap===================")
// console.log(geoCoordMap)
// console.log("================data======================")
        console.log(data)
        console.log(toolTipData)
        let max = 480,
            min = 9; // todo
        let maxSize4Pin = 100,
            minSize4Pin = 20;

        let convertData = function(data) {
            let res = [];
            for (let i = 0; i < data.length; i++) {
                let geoCoord = geoCoordMap[data[i].name];
                if (geoCoord) {
                    res.push({
                        name: data[i].name,
                        value: geoCoord.concat(data[i].value),
                    });
                }
            }
            return res;
        };
       let option = {
            title: {
                text: name_title,
                subtext: subname,
                x: 'center',
                textStyle: {
                    color: nameColor,
                    fontFamily: name_fontFamily,
                    fontSize: name_fontSize
                },
                subtextStyle:{
                    fontSize:subname_fontSize,
                    fontFamily:name_fontFamily
                }
            },
            tooltip: {
                trigger: 'item',
                formatter: function(params) {
                    if (typeof(params.value)[2] == "undefined") {
                        var toolTiphtml = ''
                        for(var i = 0;i<toolTipData.length;i++){
                            if(params.name==toolTipData[i].name){
                                toolTiphtml += toolTipData[i].name+':<br>'
                                for(var j = 0;j<toolTipData[i].value.length;j++){
                                    toolTiphtml+=toolTipData[i].value[j].name+':'+toolTipData[i].value[j].value+"<br>"
                                }
                            }
                        }
                        console.log(toolTiphtml)
                        // console.log(convertData(data))
                        return toolTiphtml;
                    } else {
                        var toolTiphtml = ''
                        for(var i = 0;i<toolTipData.length;i++){
                            if(params.name==toolTipData[i].name){
                                toolTiphtml += toolTipData[i].name+':<br>'
                                for(var j = 0;j<toolTipData[i].value.length;j++){
                                    toolTiphtml+=toolTipData[i].value[j].name+':'+toolTipData[i].value[j].value+"<br>"
                                }
                            }
                        }
                        console.log(toolTiphtml)
                        // console.log(convertData(data))
                        return toolTiphtml;
                    }
                }
            },
            // legend: {
            //     orient: 'vertical',
            //     y: 'bottom',
            //     x: 'right',
            //     data: ['credit_pm2.5'],
            //     textStyle: {
            //         color: '#fff'
            //     }
            // },
            visualMap: {
                show: true,
                min: 0,
                max: 200,
                left: 'left',
                top: 'bottom',
                text: ['高', '低'], // 文本，默认为数值文本
                calculable: true,
                seriesIndex: [1],
                inRange: {
                    // color: ['#3B5077', '#031525'] // 蓝黑
                    // color: ['#ffc0cb', '#800080'] // 红紫
                    // color: ['#3C3B3F', '#605C3C'] // 黑绿
                    // color: ['#0f0c29', '#302b63', '#24243e'] // 黑紫黑
                    // color: ['#23074d', '#cc5333'] // 紫红
                    color: ['#00467F', '#A5CC82'] // 蓝绿
                    // color: ['#1488CC', '#2B32B2'] // 浅蓝
                    // color: ['#00467F', '#A5CC82'] // 蓝绿
                    // color: ['#00467F', '#A5CC82'] // 蓝绿
                    // color: ['#00467F', '#A5CC82'] // 蓝绿
                    // color: ['#00467F', '#A5CC82'] // 蓝绿

                }
            },
            /*工具按钮组*/
            // toolbox: {
            //     show: true,
            //     orient: 'vertical',
            //     left: 'right',
            //     top: 'center',
            //     feature: {
            //         dataView: {
            //             readOnly: false
            //         },
            //         restore: {},
            //         saveAsImage: {}
            //     }
            // },
            geo: {
                show: true,
                map: mapName,
                label: {
                    normal: {
                        show: false
                    },
                    emphasis: {
                        show: false,
                    }
                },
                roam: true,
                itemStyle: {
                    normal: {
                        areaColor: '#031525',
                        borderColor: '#3B5077',
                    },
                    emphasis: {
                        areaColor: '#2B91B7',
                    }
                }
            },
            series: [{
                name: '散点',
                type: 'scatter',
                coordinateSystem: 'geo',
                data: convertData(data),
                symbolSize: function(val) {
                    return val[2] / 10;
                },
                label: {
                    normal: {
                        formatter: '{b}',
                        position: 'right',
                        show: true
                    },
                    emphasis: {
                        show: true
                    }
                },
                itemStyle: {
                    normal: {
                        color: '#05C3F9'
                    }
                }
            },
                {
                    type: 'map',
                    map: mapName,
                    geoIndex: 0,
                    aspectScale: 0.75, //长宽比
                    showLegendSymbol: false, // 存在legend时显示
                    label: {
                        normal: {
                            show: true
                        },
                        emphasis: {
                            show: false,
                            textStyle: {
                                color: '#fff'
                            }
                        }
                    },
                    roam: true,
                    itemStyle: {
                        normal: {
                            areaColor: '#031525',
                            borderColor: '#3B5077',
                        },
                        emphasis: {
                            areaColor: '#2B91B7'
                        }
                    },
                    animation: false,
                    data: data
                },
                {
                    name: '点',
                    type: 'scatter',
                    coordinateSystem: 'geo',
                    symbol: 'pin', //气泡
                    symbolSize: function(val) {
                        var a = (maxSize4Pin - minSize4Pin) / (max - min);
                        var b = minSize4Pin - a * min;
                        b = maxSize4Pin - a * max;
                        return a * val[2] + b;
                    },
                    label: {
                        normal: {
                            show: true,
                            textStyle: {
                                color: '#fff',
                                fontSize: 9,
                            }
                        }
                    },
                    itemStyle: {
                        normal: {
                            color: '#F62157', //标志颜色
                        }
                    },
                    zlevel: 6,
                    data: convertData(data),
                },
                {
                    name: 'Top 5',
                    type: 'effectScatter',
                    coordinateSystem: 'geo',
                    data: convertData(data.sort(function(a, b) {
                        return b.value - a.value;
                    }).slice(0, 5)),
                    symbolSize: function(val) {
                        return val[2] / 10;
                    },
                    showEffectOn: 'render',
                    rippleEffect: {
                        brushType: 'stroke'
                    },
                    hoverAnimation: true,
                    label: {
                        normal: {
                            formatter: '{b}',
                            position: 'right',
                            show: true
                        }
                    },
                    itemStyle: {
                        normal: {
                            color: 'yellow',
                            shadowBlur: 10,
                            shadowColor: 'yellow'
                        }
                    },
                    zlevel: 1
                },

            ]
        };
        myChart.setOption(option);
    }

    function rightFoot(myChart) {
        const result = {
            "indicator": [{
                "indicator_name": "平均绝对误差(MAE)",
                "indicator_value": "0.08101189881563187"
            }, {
                "indicator_name": "平均平方吴差(MSE)",
                "indicator_value": "0.012648699805140495"
            }, {
                "indicator_name": "平均绝对百分比误差(MAPE)",
                "indicator_value": "0.10916599631309509"
            }, {
                "indicator_name": "相对平方误差(RSE)",
                "indicator_value": "0.1145000010728836"
            }, {
                "indicator_name": "相对绝对误差(RAE)",
                "indicator_value": "0.1704999953508377"
            }],
            "actualvsfitted": [{
                "project_id": "C1093416A0GR",
                "fitted_name": "转资率",
                "fitted_value": "0.7853289842605591",
                "actual_value": "0.862529993057251",
                "mape": "0.08950509876012802",
                "correctRate": "0.910494901239872",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a",
                "residuals": "-0.07720080018043518"
            }, {
                "project_id": "C1093417A00V",
                "fitted_name": "转资率",
                "fitted_value": "0.6753730177879333",
                "actual_value": "0.6881459951400757",
                "mape": "0.018560800701379776",
                "correctRate": "0.9814391992986202",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a",
                "residuals": "-0.012772499583661556"
            }, {
                "project_id": "C1093417A05S",
                "fitted_name": "转资率",
                "fitted_value": "0.7237169742584229",
                "actual_value": "0.7263259887695312",
                "mape": "0.003592390101402998",
                "correctRate": "0.9964076136238873",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a",
                "residuals": "-0.0026092398911714554"
            }, {
                "project_id": "C1093416A0LP",
                "fitted_name": "转资率",
                "fitted_value": "0.6970229744911194",
                "actual_value": "0.7569590210914612",
                "mape": "0.07918059825897217",
                "correctRate": "0.9208193719387054",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a",
                "residuals": "-0.05993650108575821"
            }, {
                "project_id": "C1093416A0P4",
                "fitted_name": "转资率",
                "fitted_value": "0.7441400289535522",
                "actual_value": "0.8284509778022766",
                "mape": "0.10176999866962433",
                "correctRate": "0.8982304260134697",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a",
                "residuals": "-0.0843110978603363"
            }, {
                "project_id": "C1093416A0PU",
                "fitted_name": "转资率",
                "fitted_value": "0.8445169925689697",
                "actual_value": "0.8471180200576782",
                "mape": "0.0030712399166077375",
                "correctRate": "0.9969287647400051",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a",
                "residuals": "-0.0026016999036073685"
            }, {
                "project_id": "C1093416A0TB",
                "fitted_name": "转资率",
                "fitted_value": "0.7737159729003906",
                "actual_value": "0.7846720218658447",
                "mape": "0.013962400145828724",
                "correctRate": "0.986037565395236",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a",
                "residuals": "-0.010955899953842163"
            }, {
                "project_id": "C1093416A0A3",
                "fitted_name": "转资率",
                "fitted_value": "0.7680439949035645",
                "actual_value": "0.7590360045433044",
                "mape": "0.011868099682033062",
                "correctRate": "0.9881319403648376",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a",
                "residuals": "0.009008280001580715"
            }, {
                "project_id": "C1093417A007",
                "fitted_name": "转资率",
                "fitted_value": "0.8479539752006531",
                "actual_value": "0.65556800365448",
                "mape": "0.2934649884700775",
                "correctRate": "0.7065349519252777",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a",
                "residuals": "0.19238600134849548"
            }, {
                "project_id": "C1093416A0U0",
                "fitted_name": "转资率",
                "fitted_value": "0.8790789842605591",
                "actual_value": "0.7881860136985779",
                "mape": "0.11531800031661987",
                "correctRate": "0.8846815377473831",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a",
                "residuals": "0.09089239686727524"
            }, {
                "project_id": "C1093417A00T",
                "fitted_name": "转资率",
                "fitted_value": "0.8443269729614258",
                "actual_value": "0.8639410138130188",
                "mape": "0.022702999413013458",
                "correctRate": "0.9772969987243414",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a",
                "residuals": "-0.019613999873399734"
            }, {
                "project_id": "C1093416A0SS",
                "fitted_name": "转资率",
                "fitted_value": "0.6755639910697937",
                "actual_value": "0.6296219825744629",
                "mape": "0.07296759635210037",
                "correctRate": "0.9270323514938354",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a",
                "residuals": "0.04594210162758827"
            }, {
                "project_id": "C1093416A0RK",
                "fitted_name": "转资率",
                "fitted_value": "0.5426380038261414",
                "actual_value": "0.6102200150489807",
                "mape": "0.1107499971985817",
                "correctRate": "0.8892500847578049",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a",
                "residuals": "-0.06758180260658264"
            }, {
                "project_id": "C1093417A0AV",
                "fitted_name": "转资率",
                "fitted_value": "0.4515799880027771",
                "actual_value": "0.7240300178527832",
                "mape": "0.3762960135936737",
                "correctRate": "0.6237035989761353",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a",
                "residuals": "-0.2724500000476837"
            }, {
                "project_id": "C1093417A04D",
                "fitted_name": "转资率",
                "fitted_value": "0.8682270050048828",
                "actual_value": "0.8129349946975708",
                "mape": "0.0680147036910057",
                "correctRate": "0.9319853186607361",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a",
                "residuals": "0.05529149994254112"
            }, {
                "project_id": "C1093417A00F",
                "fitted_name": "转资率",
                "fitted_value": "0.943759024143219",
                "actual_value": "0.7929779887199402",
                "mape": "0.19014599919319153",
                "correctRate": "0.8098542839288712",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a",
                "residuals": "0.15078100562095642"
            }, {
                "project_id": "C1093416A0R7",
                "fitted_name": "转资率",
                "fitted_value": "0.7958329916000366",
                "actual_value": "0.8188289999961853",
                "mape": "0.028084799647331238",
                "correctRate": "0.9719151742756367",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a",
                "residuals": "-0.022996699437499046"
            }, {
                "project_id": "C1093417A052",
                "fitted_name": "转资率",
                "fitted_value": "0.9502859711647034",
                "actual_value": "0.9722660183906555",
                "mape": "0.02260719984769821",
                "correctRate": "0.9773927759379148",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a",
                "residuals": "-0.021980199962854385"
            }, {
                "project_id": "C1093417A04Q",
                "fitted_name": "转资率",
                "fitted_value": "0.8013280034065247",
                "actual_value": "0.9310529828071594",
                "mape": "0.13933099806308746",
                "correctRate": "0.8606685549020767",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a",
                "residuals": "-0.12972499430179596"
            }, {
                "project_id": "C1093417A00P",
                "fitted_name": "转资率",
                "fitted_value": "0.8668079972267151",
                "actual_value": "0.7895799875259399",
                "mape": "0.09780950099229813",
                "correctRate": "0.9021905213594437",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a",
                "residuals": "0.07722839713096619"
            }, {
                "project_id": "C1093417A012",
                "fitted_name": "转资率",
                "fitted_value": "0.7392269968986511",
                "actual_value": "0.5809980034828186",
                "mape": "0.27233999967575073",
                "correctRate": "0.7276604175567627",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a",
                "residuals": "0.15822899341583252"
            }, {
                "project_id": "C1093417A08J",
                "fitted_name": "转资率",
                "fitted_value": "0.7699919939041138",
                "actual_value": "0.8282949924468994",
                "mape": "0.0703883022069931",
                "correctRate": "0.9296116977930069",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a",
                "residuals": "-0.058302201330661774"
            }, {
                "project_id": "C1093417A045",
                "fitted_name": "转资率",
                "fitted_value": "0.8161810040473938",
                "actual_value": "0.7767720222473145",
                "mape": "0.05073399841785431",
                "correctRate": "0.9492660090327263",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a",
                "residuals": "0.03940879926085472"
            }, {
                "project_id": "C1093416A0TN",
                "fitted_name": "转资率",
                "fitted_value": "0.814365029335022",
                "actual_value": "0.8158569931983948",
                "mape": "0.0018286199774593115",
                "correctRate": "0.9981713789748028",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a",
                "residuals": "-0.0014918900560587645"
            }, {
                "project_id": "C1093416A0PV",
                "fitted_name": "转资率",
                "fitted_value": "0.5420699715614319",
                "actual_value": "0.7873520255088806",
                "mape": "0.3115279972553253",
                "correctRate": "0.6884720921516418",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a",
                "residuals": "-0.24528199434280396"
            }, {
                "project_id": "C1093416A0NP",
                "fitted_name": "转资率",
                "fitted_value": "0.8103709816932678",
                "actual_value": "0.8068000078201294",
                "mape": "0.00442609004676342",
                "correctRate": "0.9955739094875753",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a",
                "residuals": "0.0035709699150174856"
            }, {
                "project_id": "C1093417A002",
                "fitted_name": "转资率",
                "fitted_value": "0.7061949968338013",
                "actual_value": "0.7159169912338257",
                "mape": "0.0135799003764987",
                "correctRate": "0.9864200819283724",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a",
                "residuals": "-0.0097220903262496"
            }, {
                "project_id": "C1093417A03B",
                "fitted_name": "转资率",
                "fitted_value": "0.8671759963035583",
                "actual_value": "0.8741139769554138",
                "mape": "0.007937019690871239",
                "correctRate": "0.9920629793778062",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a",
                "residuals": "-0.006937860045582056"
            }, {
                "project_id": "C1093417A042",
                "fitted_name": "转资率",
                "fitted_value": "0.9019709825515747",
                "actual_value": "0.6864449977874756",
                "mape": "0.313975989818573",
                "correctRate": "0.6860244870185852",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a",
                "residuals": "0.2155269980430603"
            }, {
                "project_id": "C1093417A06S",
                "fitted_name": "转资率",
                "fitted_value": "0.694989025592804",
                "actual_value": "0.7645019888877869",
                "mape": "0.09092549979686737",
                "correctRate": "0.9090744629502296",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a",
                "residuals": "-0.06951270252466202"
            }, {
                "project_id": "C1093417A0J8",
                "fitted_name": "转资率",
                "fitted_value": "0.6714649796485901",
                "actual_value": "0.7320460081100464",
                "mape": "0.08275560289621353",
                "correctRate": "0.9172443747520447",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a",
                "residuals": "-0.06058090180158615"
            }, {
                "project_id": "C1093417A082",
                "fitted_name": "转资率",
                "fitted_value": "0.6310989856719971",
                "actual_value": "0.5879340171813965",
                "mape": "0.07341670244932175",
                "correctRate": "0.9265833348035812",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a",
                "residuals": "0.0431642010807991"
            }, {
                "project_id": "C1093416A0T5",
                "fitted_name": "转资率",
                "fitted_value": "0.757224977016449",
                "actual_value": "0.8019090294837952",
                "mape": "0.055721499025821686",
                "correctRate": "0.9442785307765007",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a",
                "residuals": "-0.04468350112438202"
            }, {
                "project_id": "C1093417A0AX",
                "fitted_name": "转资率",
                "fitted_value": "0.7245609760284424",
                "actual_value": "0.5603749752044678",
                "mape": "0.2929919958114624",
                "correctRate": "0.7070080935955048",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a",
                "residuals": "0.16418500244617462"
            }, {
                "project_id": "C1093417A03Y",
                "fitted_name": "转资率",
                "fitted_value": "0.9102389812469482",
                "actual_value": "0.909529983997345",
                "mape": "7.789420196786523E-4",
                "correctRate": "0.999221058038529",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a",
                "residuals": "7.084709941409528E-4"
            }, {
                "project_id": "C1093417A00Z",
                "fitted_name": "转资率",
                "fitted_value": "0.7455250024795532",
                "actual_value": "0.7433099746704102",
                "mape": "0.002980950055643916",
                "correctRate": "0.9970190520398319",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a",
                "residuals": "0.002215770073235035"
            }, {
                "project_id": "C1093417A04G",
                "fitted_name": "转资率",
                "fitted_value": "0.7153580188751221",
                "actual_value": "0.8402600288391113",
                "mape": "0.1486469954252243",
                "correctRate": "0.8513526618480682",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a",
                "residuals": "-0.12490200251340866"
            }, {
                "project_id": "C1093417A043",
                "fitted_name": "转资率",
                "fitted_value": "0.550819993019104",
                "actual_value": "0.8216590285301208",
                "mape": "0.3296239972114563",
                "correctRate": "0.6703756749629974",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a",
                "residuals": "-0.27083900570869446"
            }, {
                "project_id": "C1093416A0SU",
                "fitted_name": "转资率",
                "fitted_value": "0.7717700004577637",
                "actual_value": "0.725583016872406",
                "mape": "0.06365569680929184",
                "correctRate": "0.9363443031907082",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a",
                "residuals": "0.04618750140070915"
            }, {
                "project_id": "C1093417A01P",
                "fitted_name": "转资率",
                "fitted_value": "0.6737679839134216",
                "actual_value": "0.612076997756958",
                "mape": "0.10079000145196915",
                "correctRate": "0.8992096856236458",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a",
                "residuals": "0.06169139966368675"
            }, {
                "project_id": "C1093416A0TA",
                "fitted_name": "转资率",
                "fitted_value": "0.7272400259971619",
                "actual_value": "0.8737969994544983",
                "mape": "0.16772399842739105",
                "correctRate": "0.8322759568691254",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a",
                "residuals": "-0.1465570032596588"
            }, {
                "project_id": "C1093416A0R6",
                "fitted_name": "转资率",
                "fitted_value": "0.6524069905281067",
                "actual_value": "0.6930400133132935",
                "mape": "0.05863010138273239",
                "correctRate": "0.9413699209690094",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a",
                "residuals": "-0.04063300043344498"
            }, {
                "project_id": "C1093417A00A",
                "fitted_name": "转资率",
                "fitted_value": "0.5792700052261353",
                "actual_value": "0.7490500211715698",
                "mape": "0.22666099667549133",
                "correctRate": "0.7733393758535385",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a",
                "residuals": "-0.16978000104427338"
            }, {
                "project_id": "C1093417A027",
                "fitted_name": "转资率",
                "fitted_value": "0.9016410112380981",
                "actual_value": "0.8753160238265991",
                "mape": "0.0300757996737957",
                "correctRate": "0.9699241537600756",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a",
                "residuals": "0.026325900107622147"
            }, {
                "project_id": "C1093417A0AS",
                "fitted_name": "转资率",
                "fitted_value": "0.5844709873199463",
                "actual_value": "0.8133010268211365",
                "mape": "0.281360000371933",
                "correctRate": "0.7186398506164551",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a",
                "residuals": "-0.2288309931755066"
            }],
            "paramId": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a",
            "distribution": [{
                "project_id": "3",
                "actual_value": "[0.5604 - 0.6016)",
                "percent": "0.06666666666666667"
            }, {
                "project_id": "3",
                "actual_value": "[0.6016 - 0.6428)",
                "percent": "0.06666666666666667"
            }, {
                "project_id": "1",
                "actual_value": "[0.6428 - 0.6839)",
                "percent": "0.02222222222222222"
            }, {
                "project_id": "5",
                "actual_value": "[0.6839 - 0.7251)",
                "percent": "0.1111111111111111"
            }, {
                "project_id": "8",
                "actual_value": "[0.7251 - 0.7663)",
                "percent": "0.1777777777777778"
            }, {
                "project_id": "8",
                "actual_value": "[0.7663 - 0.8075)",
                "percent": "0.1777777777777778"
            }, {
                "project_id": "9",
                "actual_value": "[0.8075 - 0.8487)",
                "percent": "0.2"
            }, {
                "project_id": "5",
                "actual_value": "[0.8487 - 0.8899)",
                "percent": "0.1111111111111111"
            }, {
                "project_id": "2",
                "actual_value": "[0.8899 - 0.9311)",
                "percent": "0.04444444444444444"
            }, {
                "project_id": "1",
                "actual_value": "[0.9311 - 0.9723]",
                "percent": "0.02222222222222222"
            }],
            "feature_importance": [{
                "feature_weight": "0.9933106899261475",
                "feature_name": "变更后预算金额",
                "predicted_name": "转资率",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a"
            }, {
                "feature_weight": "0.9903746843338013",
                "feature_name": "监理费用",
                "predicted_name": "转资率",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a"
            }, {
                "feature_weight": "0.984813928604126",
                "feature_name": "甲供材料费",
                "predicted_name": "转资率",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a"
            }, {
                "feature_weight": "0.9840520620346069",
                "feature_name": "设计费用",
                "predicted_name": "转资率",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a"
            }, {
                "feature_weight": "0.9330044388771057",
                "feature_name": "测绘费用",
                "predicted_name": "转资率",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a"
            }, {
                "feature_weight": "0.7640959024429321",
                "feature_name": "分项工程个数",
                "predicted_name": "转资率",
                "param_id": "4d2a272f-fadf-4f48-bcbf-2ccf134e0e8a"
            }]
        };

        var series = [];

        const importanceData = {};
        const importanceIndex = new Set();
        for (const item of result.feature_importance) {
            if (importanceData[item.predicted_name] == null) {
                importanceData[item.predicted_name] = [];
            }
            importanceData[item.predicted_name].push(item.feature_weight);
            importanceIndex.add(item.feature_name);
        }
        for (const key in importanceData) {
            series.push({
                type: 'bar',
                xAxisIndex: 0,
                yAxisIndex: 0,
                data: importanceData[key],
                itemStyle: {
                    color: '#3399FF'
                },
                animationDelay: function(idx) {
                    return idx * 10;
                },
            });
        }

        const actualvsfittedData = [];
        const correctRateData = [];
        const correctRateIndex = [];
        for (const item of result.actualvsfitted) {
            actualvsfittedData.push([item.actual_value, item.fitted_value]);
            correctRateIndex.push(item.project_id);
            correctRateData.push(item.correctRate);
        }

        series.push({
            name: '工程转资率',
            type: 'scatter',
            xAxisIndex: 1,
            yAxisIndex: 1,
            data: actualvsfittedData,
            itemStyle: {
                color: '#FF8A00'
            },
            markLine: {
                animation: false,
                lineStyle: {
                    normal: {
                        type: 'solid'
                    }
                },
                data: [
                    [{
                        x: '7%',
                        y: '91%',
                        symbol: 'none'
                    }, {
                        x: '45%',
                        y: '58%',
                        symbol: 'none'
                    }]
                ]
            }
        });

        series.push({
            name: '工程个数',
            type: 'line',
            xAxisIndex: 2,
            yAxisIndex: 2,
            data: correctRateData,
            smooth: true,
            itemStyle: {
                color: '#3399FF'
            },
            showSymbol: false,
            animationDelay: function(idx) {
                return idx * 10;
            }
        });

        var indicator = [{
            indicator_name: '指标名称',
            indicator_value: '指标值'
        }];
        if (result.indicator) {
            for (const iterator of result.indicator) {
                indicator.push({
                    indicator_name: iterator.indicator_name,
                    indicator_value: parseFloat(iterator['indicator_value']).toFixed(3)
                });
            }
        }

        series.push({
            name: '模型拟合评估指标',
            type: 'custom',
            data: indicator,
            coordinateSystem: 'none',
            renderItem: function renderItem(params, api) {
                const style = api.style({
                    stroke: 'black',
                    fill: params.dataIndex === 0 ? '#dcdcdc' : null
                });
                const apiWidth = api.getWidth();
                const apiHeight = api.getHeight();
                let font;
                let height;
                let y0;
                if (params.dataIndex === 0) {
                    font = 'bolder 1.5em "Microsoft YaHei", sans-serif';
                    height = apiHeight * 0.07;
                    y0 = apiHeight * 0.07 + 1;
                } else {
                    font = '1.1em "Microsoft YaHei", sans-serif';
                    height = apiHeight * 0.052;
                    y0 = apiHeight * 0.088 + params.dataIndex * height + 1;
                }
                const x0 = apiWidth * 0.54;
                const value = indicator[params.dataIndex];
                return {
                    type: 'group',
                    children: [{
                        type: 'rect',
                        shape: {
                            x: x0,
                            y: y0,
                            width: 0.29 * apiWidth,
                            height: height,
                        },
                        style: style
                    }, {
                        type: 'text',
                        style: {
                            text: value['indicator_name'],
                            font: font,
                            x: x0 + 3,
                            y: y0 + height / 3,
                        }
                    }, {
                        type: 'rect',
                        shape: {
                            x: x0 + 0.29 * apiWidth,
                            y: y0,
                            width: 0.1 * apiWidth,
                            height: height
                        },
                        style: style
                    }, {
                        type: 'text',
                        style: {
                            text: value.indicator_value,
                            font: font,
                            x: x0 + 0.29 * apiWidth + 3,
                            y: y0 + height / 3
                        }
                    }]
                };
            }
        });

        let option = {
            title: [{
                text: '特征变量重要性分析',
                x: '23%',
                textAlign: 'center'
            }, {
                text: '模型拟合评估指标',
                x: '75%',
                textAlign: 'center'
            }, {
                text: '工程转资率真实值vs预测值',
                x: '23%',
                y: '50%',
                textAlign: 'center'
            }, {
                text: '工程投资转资分布图',
                x: '75%',
                y: '50%',
                textAlign: 'center'
            }],
            toolbox: {
                show: true,
                orient: 'horizontal',
                showTitle: true,
                feature: {
                    magicType: {
                        type: ['line', 'bar'],
                        seriesIndex: {
                            line: [2],
                            bar: [2]
                        }
                    },
                    saveAsImage: {
                        type: 'png',
                        show: true,
                        title: '保存为图片',
                    }
                }
            },
            grid: [{
                x: '7%',
                y: '7%',
                width: '38%',
                height: '33%'
            }, {
                x: '7%',
                y2: '9%',
                width: '38%',
                height: '33%'
            }, {
                x2: '7%',
                y2: '9%',
                width: '38%',
                height: '33%'
            }],
            tooltip: {
                formatter: '{a}: {c}'
            },
            xAxis: [{
                gridIndex: 0,
                min: 0,
                boundaryGap: ['0', '5%']
            }, {
                gridIndex: 1,
                type: 'value',
                scale: true,
                name: '实际值',
                nameLocation: 'middle',
                nameGap: 27,
            }, {
                gridIndex: 2,
                type: 'category',
                data: correctRateIndex,
                axisPointer: {
                    type: 'shadow'
                },
                axisLabel: {
                    rotate: 30
                }
            }],
            yAxis: [{
                gridIndex: 0,
                type: 'category',
                data: Array.from(importanceIndex),
                axisPointer: {
                    type: 'shadow'
                },
                axisLabel: {
                    rotate: 40
                }
            }, {
                gridIndex: 1,
                type: 'value',
                scale: true,
                name: '预测值',
                nameLocation: 'middle',
                nameGap: 30,
                nameRotate: 90
            }, {
                gridIndex: 2,
                type: 'value',
                scale: true,
                axisLabel: {
                    formatter: (value, index) => {
                        return `${value * 100}%`;
                    }
                },
                splitLine: {
                    show: false
                }
            }],
            series: series
        };
        myChart.setOption(option);
    }


</script>

</body>
</html>